<?php
    $order = array ( 
        array( 
    
            "status" => 0, 
    
            "name" => "测试111111111"
    
        ), 
    
        array( 
    
            "status" => 1, 
    
            "name" => "测试22222222222222"
    
        ), 
    
        array( 
    
            "status" => 2, 
    
            "name" => "测试3333333333333333"
    
        ) 
    
    ); 
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <title>外卖订单</title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet" />
    <link href="css/index.css" rel="stylesheet" />
    <link rel="stylesheet" href="css/core.css">
</head>
<body>
    <section class="waimai-order">
        <header id="header" class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
            <h1 id="editAddressTittle" class="mui-title">外卖订单</h1>
            <span style="font-size: 12px;" class="mui-btn mui-btn-blue mui-btn-link mui-pull-right waimai-order-header-right">待接单<span class="mui-badge mui-badge-danger waimai-order-header-right-badge">1</span></span>
        </header>
        <?php foreach ($order as $key => $val) { ?>
            <div class="waimai-order-item">
                <div class="waimai-order-item-header">
                    <h3 class="item-header-title">
                    <?php echo $val['name'] ?>
                    </h3>
                    <p class="item-header-mark"> <span class="item-header-mark-tel">12345678901</span><span class="item-header-mark-gender">（女士）</span></p>
                </div>
                <div class="waimai-order-item-content">
                    <ul class="item-content-list">
                        <li class="item-content-list-image"><img src="./images/1.jpg" alt=""></li>
                        <li class="item-content-list-info">
                            <h5 class="item-content-list-info-title">银河气泡美式</h5>
                            <p class="item-content-list-info-mark">大/全糖/饼</p>
                        </li>
                        <li class="item-content-list-number">x1</li>
                    </ul>
                    <ul class="item-content-list">
                        <li class="item-content-list-image"><img src="./images/1.jpg" alt=""></li>
                        <li class="item-content-list-info">
                            <h5 class="item-content-list-info-title">银河气泡美式</h5>
                            <p class="item-content-list-info-mark">大/全糖/饼</p>
                        </li>
                        <li class="item-content-list-number">x1</li>
                    </ul>
                </div>
                <div class="waimai-order-item-footer">
                    <div class="item-footer-total">
                        <span class="item-footer-total-date">2020-05-20 13:49</span>
                        <span class="item-footer-total-info">共 <strong>1</strong>件商品 合计：<strong>¥13</strong></span>
                    </div>
                    <div class="item-footer-button">
                            <?php switch ($val['status']){case 0:?>
                                <button id="goWaimaiOrder" class="mui-btn mui-btn-primary" order_id="1111111111111" type="button" name="button">待接单</button>
                                <?php break; case 1:?>
                                    <button class="mui-btn" disabled type="button" name="button">正在送货</button>
                                <?php break; case 2:?>
                                    <button class="mui-btn" disabled type="button" name="button">骑手已到店</button>
                              <?php break; default:?>
                            <?php } ?>
                        <!-- <button type="button" class="mui-btn mui-btn-primary"><?php if($val['status'] == 0){echo '待接单';}else if ($val['status'] == 1){echo '正在送货';} else {echo '骑手已到店';} ?></button> -->
                    </div>
                </div>
            </div>
        <?php } ?>
    </section>
</body>
<script src="js/jquery-2.2.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
    mui.init();
    $('#goWaimaiOrder').click(function () {
        console.log($(this).attr('order_id'))
    })
})
</script>
</html>